<template>
  <el-sub-menu v-if="item.subMenus && item.subMenus.length" :index="String(item.id)">
    <template #title>
      <span>{{ item.label }}</span>
    </template>
    <menu-item
        v-for="sub in item.subMenus"
        :key="sub.id"
        :item="sub"
    />
  </el-sub-menu>
  <el-menu-item v-else :index="String(item.id)">
    {{ item.label }}
  </el-menu-item>
</template>

<script setup>
defineProps({
  item: {
    type: Object,
    required: true
  }
})

</script>

<style scoped>

</style>